<template>
  <div>
    <!-- <template v-if="item.searchslot">
            <slot :name="`${item.prop}Search`" :form="formModel" />
          </template> -->
    <template v-if="item.searchType">
      <el-select v-if="['select'].includes(item.searchType)" v-model="formModel[item.prop]" v-bind="item.searchBind"
                 :placeholder="`请选择${item.label}`" :clearable="item.clearable!==false">
        <el-option
          v-for="dict in item.searchData()"
          :key="dict[item.selectValue] || dict.value"
          :label="dict[item.selectLabel] || dict.label"
          :value="dict[item.selectValue] || dict.value"
        />
      </el-select>
    </template>
    <template v-else>
      <el-select v-if="['select','dict','switch'].includes(item.type)" v-model="formModel[item.prop]" v-bind="item.searchBind"
                 :placeholder="`请选择${item.label}`" :clearable="item.clearable!==false">
        <el-option
          v-for="dict in ((item.type ==='dict' || item.type==='switch'&&item.formatter) ? item.formatter() : (item.dicData || []) )"
          :key="dict[item.selectValue] || dict.value"
          :label="dict[item.selectLabel] || dict.label"
          :value="dict[item.selectValue] || dict.value"
        />
      </el-select>
      <el-date-picker
        v-else-if="['date','datetimerange'].includes(item.type)"
        v-model="formModel[item.prop]"
        :type="item.type"
        :format="item.format || 'yyyy-MM-dd'"
        :value-format="item.valueFormat || 'yyyy-MM-dd'"
        :picker-options="item.pickerOptions || {}"
        :clearable="item.clearable!==false"
        :placeholder="`选择${item.label}`"
        :start-placeholder="`${item.startPlaceholder || '开始日期'}`"
        :end-placeholder="`${item.endPlaceholder || '结束日期'}`"
        v-bind="item.searchBind"
      />
      <el-input
        v-else
        v-model.trim="formModel[item.prop]"
        :maxlength="item.maxlength || 30"
        :placeholder="`请输入${item.label}`"
        :clearable="item.clearable!==false"
        v-bind="item.searchBind"
        @keyup.enter.native="searchSubmit"
      />
    </template>

  </div>
</template>

<script>

export default {
  props: {
    item: {
      type: Object,
      default: () => {}
    },
    formModel: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {}
  },
  methods: {
    searchSubmit() {
      this.$emit('searchSubmit')
    }
  }
}
</script>

  <style type="text/css" scoped>
  </style>

